
import THREE from './three.js'
//加载动画插件
import TWEEN from 'tween'

initTween()
export function renderGeo(dom,domWidth,domHeight) {
  window.onload=function(){
    this.DOM =  document.querySelector(dom);
    //设置视窗
    var scene = new THREE.Scene();
//设置相机
    var camera = new THREE.PerspectiveCamera(75, DOM.clientWidth/DOM.clientHeight, 0.1, 1000);
//设置渲染视窗
    var renderer = new THREE.WebGLRenderer();
    renderer.setSize(DOM.clientWidth, DOM.clientHeight); //设置渲染视窗的大小
    //注意，渲染器renderer的domElement元素，表示渲染器中的画布，所有的渲染都是画在domElement上的，所以这里的appendChild表示将这个domElement挂接在body下面，这样渲染的结果就能够在页面中显示了。
    //将视窗设置到dom
    DOM.appendChild(renderer.domElement);
    //设置一个几何体
    var geometry = new THREE.CubeGeometry(1,1,1);
    //设置一个材质
    var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
    //给几何体赋予材质
    var cube = new THREE.Mesh(geometry, material);
    //将这个几何体给与视窗
    scene.add(cube);
    //调整相机
    camera.position.z = 5;
    //设置动画
    function render() {
      //动画的方法
      //再次渲染视窗
      requestAnimationFrame(render);
      cube.rotation.x += 0.1;
      cube.rotation.y += 0.1;
      renderer.render(scene, camera);
    }
    //render();
    //渲染当前视窗
    renderer.render(scene, camera);
  }

//   //性能监视器Stats的使用
//   var stats = new Stats();
//   stats.setMode(1); // 0: fps, 1: ms
// // 将stats的界面对应左上角
//   stats.domElement.style.position = 'absolute';
//   stats.domElement.style.left = '0px';
//   stats.domElement.style.top = '0px';
//   document.body.appendChild( stats.domElement );
//   setInterval( function () {
//     stats.begin();
//     // 你的每一帧的代码
//     stats.end();
//   }, 1000 / 60 );

}


